<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" src="../../lib/html5shiv.js?rev=@@hash"></script>
    <script type="text/javascript" src="../../lib/respond.min.js?rev=@@hash"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="../../static/h-ui/css/H-ui.min.css"/>
    <link rel="stylesheet" type="text/css" href="../../static/h-ui.admin/css/H-ui.admin.css"/>
    <link rel="stylesheet" type="text/css" href="../../lib/Hui-iconfont/1.0.8/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="../../lib/Validform/5.3.2/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../static/h-ui.admin/skin/default/skin.css" id="skin"/>
    <link rel="stylesheet" type="text/css" href="../../static/h-ui.admin/css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../ht-css/Project.css"/>
    <!--引入分页-->
    <link rel="stylesheet" href="../../lib/pagination/pagination.css">
    <!--[if IE 6]>
    <script type="text/javascript" src="../../lib/DD_belatedPNG_0.0.8a-min.js?rev=@@hash"></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="../../ht-css/style-q.css"/>
    <link rel="stylesheet" href="../../ht-css/combo.select.css">
    <title>商品管理</title>
    <style>
        .relation {
            background: #FFFFFF;
            border: 1px solid #00a0e9;
        }

        .relation li {
            line-height: 2;
        }

        .relation li:hover {
            background: #00a0e9;
            color: #FFFFFF;
        }

        .guanlian {
            position: absolute;
            top: 35px;
            width: 100%;
            overflow-y: scroll;
            max-height: 150px;
            display: none;
        }

        .guanlian li {
            text-indent: 20px;
        }

        .pagination li {
            float: left;
            margin-left: 5px;
            width: 26px;
            height: 26px;
            border: 1px solid #ccc;
            text-align: center;
            color: #666;
        }

        .pagination li:hover {
            background-color: #5a98de;
        }

        .pagination li:hover a {
            color: #fff;
        }

        .dis_btn {
            background: #9c9a9a;
            color: #fff;
            border: 1px solid #9c9a9a;
        }

        .dis_btn:hover {
            background: #9c9a9a;
            color: #fff;
            border: 1px solid #9c9a9a;
        }
    </style>
</head>
<body data-id="42">
<nav class="breadcrumb">商品管理 <span class="c-gray en">&gt;</span> 图片管理 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<article class="page-container">
    <div class="ml-20 mr-20" id="form-member-add" method="post">
        <div id="tab_topnav" class="HuiTab">
            <div class="tabBar clearfix"><span>商品图片管理</span></div>
            <!--商品图片管理-->
            <div class="tabCon pd-5 bg-1 bk-gray pb-10">
                <div class="lh-20 pd-10">
                    <form name="name2" id="picForm">
                        <table class="table-hover table_li ml-10 mb-10 table">
                            <thead class="text-l">
                            <tr>
                                <td colspan="3" class="col-1-1">
                                    <div class="row ml-10">
                                        <label class="form-label f-l label-4">商品分类：</label>
                                        <span class="size-M radius col-xs-8 f-l" style="width:15%">
                                     <div style="position: relative;z-index: 900;">
                                          <input type="text" autocomplete="off" class="input-text radius" name="imgClass1" placeholder="请选择一级分类" oninput="imgGoods_listCategory(1)" id="imgClass1" datatype="*0-20" errormsg="格式错误，请重新输入" ignore="ignore">
                                          <ul class="relation radius guanlian" id="img-classUl1"></ul>
                                      </div>
                                      <span class="Validform_checktip"></span>
                                  </span>
                                        <span class="f-l pl-10 pr-10 pt-5">~</span>
                                        <span class="size-M radius col-xs-8 f-l" style="width:15%">
                                      <div style="position: relative;z-index: 900;">
                                          <input type="text" autocomplete="off" class="input-text radius" name="imgClass2" placeholder="请选择二级分类" id="imgClass2" datatype="*0-20" errormsg="格式错误，请重新输入" ignore="ignore">
                                          <ul class="relation radius guanlian" id="img-classUl2"></ul>
                                      </div>
                                      <span class="Validform_checktip"></span>
                                  </span>
                                        <span class="f-l pl-10 pr-10 pt-5">~</span>
                                        <span class="size-M radius col-xs-8" style="width:15%">
                                      <div style="position: relative;z-index: 900;">
                                          <input type="text" autocomplete="off" class="input-text radius" name="imgClass3" placeholder="请选择三级分类" id="imgClass3" datatype="*0-20" errormsg="格式错误，请重新输入" ignore="ignore">
                                          <ul class="relation radius guanlian" id="img-classUl3"></ul>
                                      </div>
                                      <span class="Validform_checktip"></span>
                                  </span>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="col-3-1">
                                    <div class="row ml-10">
                                        <label class="form-label f-l label-4">图片名称：</label>
                                        <div class="formControls col-sm-9">
                                            <input type="text" class="input-text radius" name="imgname" id="imgName" placeholder="输入图片名称关键字" datatype="/^[a-zA-Z0-9\u4e00-\u9fa5]{0,50}$/" errormsg="格式错误，请重新输入" ignore="ignore">
                                        </div>
                                        <span class="Validform_checktip"></span>
                                    </div>
                                </td>
                                <td class="col-3-1">
                                    <div class="row ml-10">
                                        <label class="form-label f-l label-4">SPU码：</label>
                                        <div class="formControls col-xs-8 col-sm-9">
                                            <input type="text" class="input-text radius" name="spuCode" id="spuCode" placeholder="输入SPU码" datatype="n0-11" errormsg="格式错误，请重新输入" ignore="ignore">
                                        </div>
                                        <span class="Validform_checktip"></span>
                                    </div>
                                </td>
                                <td class="col-3-1">
                                    <div class="row ml-10">
                                        <label class="form-label f-l label-4">Code码：</label>
                                        <div class="formControls col-sm-9">
                                            <input type="text" class="input-text radius" name="skuCode" id="skuCode" placeholder="输入Code码" datatype="*0-15" errormsg="格式错误，请重新输入" ignore="ignore">
                                        </div>
                                        <span class="Validform_checktip"></span>
                                    </div>
                                </td>
                            </tr>
                            </thead>
                        </table>
                        <div class="text-c pb-20 pt-10">
                            <input id="btn" type="submit" class="powerButton 1000001954909102 btn btn-secondary radius size-S" value="查&nbsp;&nbsp;询">
                            <input name="" type="reset" onclick="resetDiv()" class="btn radius size-S ml-10 powerButton 1000001954909102" value="重&nbsp;&nbsp;置">
                        </div>
                    </form>
                    <div class="text-l pl-20 pb-10 clearfix powerButton 1000001017645877"><input class="btn radius btn-secondary-outline radius f-l" onclick="addImg()" type="button" value="新增"></div>
                    <div class="line"></div>
                    <ul id="imgListBox" class="sale_pic clearfix"></ul>
                    <div class="dataTables_wrapper goods_fanye clearfix">
                        <div class="f-r pageturning M-box4"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</article>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="../../lib/jquery/1.9.1/jquery.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/layer/2.4/layer.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/laypage/1.2/laypage.js?rev=@@hash"></script>
<script type="text/javascript" src="../../static/h-ui/js/H-ui.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../static/h-ui.admin/js/H-ui.admin.js?rev=@@hash"></script> <!--/_footer 作为公共模版分离出去-->
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="../../lib/My97DatePicker/4.8/WdatePicker.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/datatables/1.10.0/jquery.dataTables.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/laypage/1.2/laypage.js?rev=@@hash"></script>
<script type="text/javascript" src="../../ht-js/frame/doT.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/jquery.combo.select.js?rev=@@hash"></script>
<!--表单验证-->
<script type="text/javascript" src="../../lib/Validform/5.3.2/Validform_v5.3.2_min.js?rev=@@hash"></script>
<script src="../../lib/pagination/jquery.pagination.js?rev=@@hash"></script>
<script src="../../ht-js/public.js?rev=@@hash"></script>
<!--验证token-->
<script src="../../ht-js/verifyToken.js?rev=@@hash"></script>
<link rel="stylesheet" type="text/css" href="../../ht-css/jedate.css" />
<!--时间组件-->
<script type="text/javascript" src="../../lib/jquery.jedate.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../ht-js/power.js?rev=@@hash"></script>
<script src="../../ht-js/goods/goods-list.js?rev=@@hash"></script>
<script>
    function spu_add(title, url) {
        var index = layer.open({
            type: 2,
            title: title,
            content: url
        });
        layer.full(index);
    }
    /*删除添加spu图片的缓存，防止刷新页面后缓存不消失*/
    sessionStorage.removeItem("spuImgCache");
    sessionStorage.removeItem("brand_name");
    sessionStorage.removeItem("brand_id");
    sessionStorage.removeItem("attrObjCanch");
    sessionStorage.removeItem("attrId");

    /*tab切换*/
    jQuery.Huitab = function (tabBar, tabCon, class_name, tabEvent, i) {
        var $tab_menu = $(tabBar);
// 初始化操作
        $tab_menu.removeClass(class_name);
        $(tabBar).eq(i).addClass(class_name);
        $(tabCon).hide();
        $(tabCon).eq(i).show();
        $tab_menu.bind(tabEvent, function () {
            $tab_menu.removeClass(class_name);
            $(this).addClass(class_name);
            var index = $tab_menu.index(this);
            $(tabCon).hide();
            $(tabCon).eq(index).show()
        })
    }

    $(function () {
        $.Huitab("#tab_topnav .tabBar span", "#tab_topnav .tabCon", "current", "click", "0")
    });
    $(function () {
        $(".classForm").Validform({
            tiptype: 2,
            callback: function (form) {
                reloadSpuTable();
                return false;
            }
        });
    });
    $(function () {
        $("#picForm").Validform({
            tiptype: 2,
            callback: function (form) {
                img_list();
                return false;
            }
        });
        /*时间设置*/
        function timeSet(startEl, endEl, timeFormat) {
            /*startEl=>开始时间Input的id，endEl=>结束时间Input的id，时间格式（YYYY-MM-DD hh:mm:ss  YYYY年MM月DD日 hh:mm:ss）*/
            /*时间设置*/
            var thisMaxTime = $.nowDate().substring(0, $.nowDate().length - 8) + "23:59:59";
            var start = {
                format: timeFormat,
                maxDate: thisMaxTime,
                okfun: function (obj) {
                    end.minDate = obj.val.substring(0, obj.val.length - 5) + "00:00:00"; //开始日选好后，重置结束日的最小日期
                }
            };
            var end = {
                format: timeFormat,
                maxDate: thisMaxTime,
                okfun: function (obj) {
                    start.maxDate = obj.val.substring(0, obj.val.length - 5) + "23:59:59"; //将结束日的初始值设定为开始日的最大日期
                }
            };
            $.jeDate(startEl, start);
            $.jeDate(endEl, end);
        }
        timeSet("#creationDateBegin","#creationDateEnd","YYYY-MM-DD hh:mm:ss");
    });
</script>
</body>
</html>